import styles from './index.scss'

const RiskEvaluate = () => {
  //等级划分
  let levelRank = [
    {
      rank: 'R1 (低风险)',
      intro: '结构简单，容易理解、流动性高、本金遭受损失的可能性极低'
    },
    {
      rank: 'R2 (中低风险)',
      intro: '结构简单，容易理解、流动性较高、本金遭受损失的可能性较低'
    },
    {
      rank: 'R3 (中风险)',
      intro: '结构较简单，流动性较高、本金安全具有一定的不确定性，在特殊情况下可能损失全部本金'
    },
    {
      rank: 'R4 (中高风险)',
      intro: '结构复杂，流动性较低，本金安全面临较大的不确定性，可能损失全部本金'
    },
    {
      rank: 'R5 (高风险)',
      intro: '结构复杂，不易理解，不易估值、流动性低、透明度较低，本金安全面临极大的不确定性，甚至损失可能超过本金'
    },
  ]
  //匹配结果
  let matchResult = [
    {
      title: '1.1 若您的风险承受能力等级为C1(最低保守型、保守型)',
      intro: '您适合购买或接收风险等级为R1的产品或服务，但风险等级为R2、R3、R4、R5的产品或服务与您的风险承受能力不匹配'
    },
    {
      title: '1.2若您的风险承受能力等级为C2(谨慎型）',
      intro: '您适合购买或接收风险等级为R1、R2的产品或服务，但风险等级为R3、R4、R5的产品或服务与您的风险承受能力不匹配'
    },
    {
      title: '1.3若您的风险承受能力等级为C3(稳健型）',
      intro: '您适合购买或接收风险等级为R1、R2、R3的产品或服务，但风险等级为R4、R5的产品或服务与您的风险承受能力不匹配'
    },
    {
      title: '1.4若您的风险承受能力等级为C4(积极型）',
      intro: '您适合购买或接收风险等级为R1、R2、R3、R4的产品或服务，但风险等级为R5的产品或服务与您的风险承受能力不匹配'
    },
    {
      title: '1.5若您的风险承受能力等级为C5(激进型）',
      intro: '您适合购买或接受的产品或服务包括所有产品及相关服务'
    }
  ]
  let levelRankDom = levelRank.map(( item, ind) => {
    return (
      <div key={ind}>
        <div className={styles.rank}>{item.rank}</div>
        <div className={styles.intro}>{item.intro}</div>
      </div>
    )
  })
  let matchResultDom = matchResult.map(( item, ind) => {
    return (
      <div key={ind}>
        <div className={styles.matchTitle}>{item.title}</div>
        <div className={styles.matchIntro}>{item.intro}</div>
      </div>
    )
  })
  return (
    <div>
      <div className={styles.items}>
      <div className={styles.toptip}>尊敬的投资者，您的风险承受能力为</div>
      <div className={styles.levelResult}>
        <div className={styles.intro}>
          <div className={styles.title}>C4:积极型</div>
          <div>如果您已经购买或接受以下一种或多种产品或服务，本公司提醒您关注以下内容：</div>
        </div>
        <div className={styles.graph}></div>
      </div>
      <div className={styles.levelRank}>
        <div className={styles.title}>我公司提供的产品或服务风险等级划分如下</div>
        {levelRankDom}
      </div>
      </div>
      <div className={styles.items}>
        <div className={styles.mainTitle}>服务适当性匹配结果如下</div>
        {matchResultDom}
      </div>
      <div className={styles.items}>
        <div className={styles.mainTitle}>申万证券提示您交易有风险，请您知晓</div>
        <div className={styles.dealTip}>本公司提示您关注上述适当性评估结果。若您已购买或接受不适合您购买或接受的产品及相关服务，建议您应当审慎考察该产品及相关服务的特征及风险，取消相关交易权限或在产品开放日赎回该产品。</div>
        <div className={styles.riskItem}>1、本公司在此郑重提醒，本公司向您销售的产品或提供的服务将以您的风险承受能力等级为基础，若您提供的信息发生任何重大变化，您都应当及时书面通知本公司。本公司建议您审慎评判自身风险承受能力、结合自身投资行为，作出审慎的投资判断。</div>
        <div className={styles.riskItem}>2、本公司的适当性匹配意见不表明公司对产品或者服务的风险和收益做出实质性判断或者保证，本公司履行投资者适当性职责不能取代您本人的投资判断，不会降低金融产品或金融服务的固有风险，也不会影响您依法承担相应的投资风险、履约责任以及费用。</div>
        <div className={styles.riskItem}>3、本人（机构）经贵公司提示，已充分知晓贵公司向本人（机构）销售的产品或提供的服务将以本人（机构）此次确认的风险承受能力等级为基础。若本人（机构）提供的信息发生任何重大变化，本人（机构）都会及时书面通知贵公司。本人已知晓并确认上述适当性评估结果，将自主承担购买或接受相关产品或服务可能引起的损失和其他后果。本确认函系本人（机构）独立、自主、真实的意思表示，特此确认。</div>
      </div>
    </div>
  )
}


export default RiskEvaluate

